import * as THREE from 'three';
import type Viewer from '../Viewer';
import { Sky } from '../type';

/** 场景天空盒*/
export default class SkyBoxs {
  protected viewer: Viewer;
  
  constructor (viewer: Viewer) {
    this.viewer = viewer;
  }

  /**
   * 添加雾效果
   * @param color 颜色方法接受三个参数 color、near 和 far，分别表示雾的颜色、起始距离和结束距离，默认取值为 0xa0a0a0（灰色）、500 和 2000
   */
  public addFog (color = 0xa0a0a0, near = 500, far = 2000) {
    // 创建一个新的 THREE.Fog 实例，使用传入的颜色、起始距离和结束距离作为参数。
    // 将创建的雾效实例赋值给场景对象的 fog 属性，即将雾效应用到整个场景中。
    this.viewer.scene.fog = new THREE.Fog(new THREE.Color(color), near, far);
  }

  /**
   * 移除雾效果
   */
  public removeFog () {
    this.viewer.scene.fog = null;
  }

  /**
   * 添加默认天空盒
   * @param skyType
   */
  public addSkybox (skyType: keyof typeof Sky = Sky.daytime) {
    // 根据传入的 skyType 值获取对应的天空盒路径，通过拼接字符串的方式生成完整的路径。
    const path = `/skybox/${Sky[skyType]}/`; // 设置路径
    // 设定天空盒图片的格式为 .jpg。
    const format = '.jpg'; // 设定格式
    // 用 setSkybox 方法，将生成的完整路径和图片格式作为参数传入，来设置场景的天空盒。
    this.setSkybox(path, format);
  }

  /**
   * 自定义添加天空盒
   * @param path 天空盒地址
   * @param format 图片后缀名
   */
  private setSkybox (path: string, format = '.jpg') {
    // 创建一个 THREE.CubeTextureLoader 实例 loaderbox 用于加载立方体贴图。
    const loaderbox = new THREE.CubeTextureLoader();
    // 使用 loaderbox.load 方法加载六张天空盒图片，分别代表天空盒的正面、背面、顶部、底部、左侧和右侧。
    const cubeTexture = loaderbox.load([
      path + 'posx' + format,
      path + 'negx' + format,
      path + 'posy' + format,
      path + 'negy' + format,
      path + 'posz' + format,
      path + 'negz' + format,
    ]);
    // 需要把色彩空间编码改一下
    cubeTexture.encoding = THREE.sRGBEncoding;
    // 最后将设置好的立方体贴图赋值给场景对象的 background 属性，即将该立方体贴图作为场景的天空盒背景。
    this.viewer.scene.background = cubeTexture;
  }
}
